<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en">
<head>
<title>地方</title>
<meta charset="utf-8">
<meta name="viewport"
	content="width=device-width, initial-scale=1, shrink-to-fit=no">

<link
	href="https://fonts.googleapis.com/css?family=Poppins:200,300,400,500,600,700"
	rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Abril+Fatface"
	rel="stylesheet">

<link rel="stylesheet"
	href="${pageContext.request.contextPath}/user/css/open-iconic-bootstrap.min.css">
<link rel="stylesheet"
	href="${pageContext.request.contextPath}/user/css/animate.css">

<link rel="stylesheet"
	href="${pageContext.request.contextPath}/user/css/owl.carousel.min.css">
<link rel="stylesheet"
	href="${pageContext.request.contextPath}/user/css/owl.theme.default.min.css">
<link rel="stylesheet"
	href="${pageContext.request.contextPath}/user/css/magnific-popup.css">

<link rel="stylesheet"
	href="${pageContext.request.contextPath}/user/css/aos.css">

<link rel="stylesheet"
	href="${pageContext.request.contextPath}/user/css/ionicons.min.css">

<link rel="stylesheet"
	href="${pageContext.request.contextPath}/user/css/bootstrap-datepicker.css">
<link rel="stylesheet"
	href="${pageContext.request.contextPath}/user/css/jquery.timepicker.css">

<link rel="stylesheet"
	href="${pageContext.request.contextPath}/user/css/flaticon.css">
<link rel="stylesheet"
	href="${pageContext.request.contextPath}/user/css/icomoon.css">
<link rel="stylesheet"
	href="${pageContext.request.contextPath}/user/css/style.css">

<link rel="stylesheet" href="layui/css/layui.css" media="all">
<link rel="stylesheet" href="layui/css/MyBoot.css" media="all">
</head>
<body>


	<jsp:include page="nav.jsp"></jsp:include>
	<!-- END nav -->

	<div class="hero-wrap js-fullheight"
		style="background-image: url('${pageContext.request.contextPath}/user/images/bg_1.jpg');">
		<div class="overlay"></div>
		<div class="container">
			<div
				class="row no-gutters slider-text js-fullheight align-items-center justify-content-center"
				data-scrollax-parent="true">
				<div class="col-md-9 text-center ftco-animate"
					data-scrollax=" properties: { translateY: '70%' }">
					<p class="breadcrumbs"
						data-scrollax="properties: { translateY: '30%', opacity: 1.6 }">
						<span class="mr-2"><a href="${pageContext.request.contextPath}index">主页</a></span> <span>住所</span>
					</p>
					<h1 class="mb-3 bread"
						data-scrollax="properties: { translateY: '30%', opacity: 1.6 }">美食</h1>
				</div>
			</div>
		</div>
	</div>

	<section class="ftco-section">
		<div class="container">
			<div class="row">
				 <div class="col-lg-3 sidebar order-md-last ftco-animate">
					<div class="sidebar-wrap ftco-animate">
						<h3 class="heading mb-4">商家信息</h3>
						
						<div class="destination">
								<a href="${pageContext.request.contextPath}/userapi/showfoodsbyriu/${pd.data[0].rid}"
									class="img img-2 d-flex justify-content-center align-items-center"
									style="background-image: url('${pd.data[0].rimg}');">
									<div
										class="icon d-flex justify-content-center align-items-center">
										<span class="icon-link"></span>
									</div>
								</a>
								<div class="text p-3">
									<div class="d-flex">
										<div class="one">
											<h3>
												餐厅名：${pd.data[0].rname}
											</h3>
											<!-- <p class="rate">
												<i class="icon-star"></i> <i class="icon-star"></i> <i
													class="icon-star"></i> <i class="icon-star"></i> <i
													class="icon-star-o"></i> <span>8 Rating</span>
											</p> -->
										</div>
										<!-- <div class="two">
											<span class="price">$200</span>
										</div> -->
									</div>
									<p>餐厅介绍：${pd.data[0].rcontent}</p>
									<!-- <p class="days">
										<span>2 days 3 nights</span>
									</p> -->
									<!-- <hr>
									<p class="bottom-area d-flex">
										<span><i class="icon-map-o"></i> San Franciso, CA</span> <span
											class="ml-auto"><a href="#">Discover</a></span>
									</p> -->
									<p>餐厅电话：${pd.data[0].rtel}</p>
									<p>餐厅地址：${pd.data[0].raddress }</p>
								</div>
								
							</div>
						
						
						<!-- <form action="#">
							<div class="fields">
								<div class="form-group">
									<input type="text" class="form-control" placeholder="目的地,城市">
								</div>
								<div class="form-group">
									<div class="select-wrap one-third">
										<div class="icon">
											<span class="ion-ios-arrow-down"></span>
										</div>
										<select name="" id="" class="form-control"
											placeholder="Keyword search">
											<option value="">选择地址</option>
											<option value="">旧金山海湾</option>
											<option value="">德国柏林</option>
											<option value="">英国伦敦</option>
											<option value="">法国巴黎</option>
										</select>
									</div>
								</div>
								<div class="form-group">
									<input type="text" id="checkin_date"
										class="form-control checkin_date" placeholder="起始时间">
								</div>
								<div class="form-group">
									<input type="text" id="checkout_date"
										class="form-control checkout_date" placeholder="到达时间">
								</div>
								<div class="form-group">
									<div class="range-slider">
										<span> <input type="number" value="25000" min="0"
											max="120000" /> - <input type="number" value="50000" min="0"
											max="120000" />
										</span> <input value="1000" min="0" max="120000" step="500"
											type="range" /> <input value="50000" min="0" max="120000"
											step="500" type="range" />
										</svg>
									</div>
								</div>
								<div class="form-group">
									<input type="submit" value="搜索"
										class="btn btn-primary py-3 px-5">
								</div>
							</div> -->
						</form>
					</div>
					<!-- <div class="sidebar-wrap ftco-animate">
						<h3 class="heading mb-4">星级</h3>
						<form method="post" class="star-rating">
							<div class="form-check">
								<input type="checkbox" class="form-check-input"
									id="exampleCheck1"> <label class="form-check-label"
									for="exampleCheck1">
									<p class="rate">
										<span><i class="icon-star"></i><i class="icon-star"></i><i
											class="icon-star"></i><i class="icon-star"></i><i
											class="icon-star"></i></span>
									</p>
								</label>
							</div>
							<div class="form-check">
								<input type="checkbox" class="form-check-input"
									id="exampleCheck1"> <label class="form-check-label"
									for="exampleCheck1">
									<p class="rate">
										<span><i class="icon-star"></i><i class="icon-star"></i><i
											class="icon-star"></i><i class="icon-star"></i><i
											class="icon-star-o"></i></span>
									</p>
								</label>
							</div>
							<div class="form-check">
								<input type="checkbox" class="form-check-input"
									id="exampleCheck1"> <label class="form-check-label"
									for="exampleCheck1">
									<p class="rate">
										<span><i class="icon-star"></i><i class="icon-star"></i><i
											class="icon-star"></i><i class="icon-star-o"></i><i
											class="icon-star-o"></i></span>
									</p>
								</label>
							</div>
							<div class="form-check">
								<input type="checkbox" class="form-check-input"
									id="exampleCheck1"> <label class="form-check-label"
									for="exampleCheck1">
									<p class="rate">
										<span><i class="icon-star"></i><i class="icon-star"></i><i
											class="icon-star-o"></i><i class="icon-star-o"></i><i
											class="icon-star-o"></i></span>
									</p>
								</label>
							</div>
							<div class="form-check">
								<input type="checkbox" class="form-check-input"
									id="exampleCheck1"> <label class="form-check-label"
									for="exampleCheck1">
									<p class="rate">
										<span><i class="icon-star"></i><i class="icon-star-o"></i><i
											class="icon-star-o"></i><i class="icon-star-o"></i><i
											class="icon-star-o"></i></span>
									</p>
								</label>
							</div>
						</form>
					</div> -->
				</div>
				<!-- END-->
				<div class="col-lg-9">
					<div class="row">
						
						<c:forEach items="${pd.data}" var="rfoods">
						<div class="col-sm col-md-6 col-lg-4 ftco-animate">
							<div class="destination">
								<a href="#"
									class="img img-2 d-flex justify-content-center align-items-center"
									style="background-image: url('${rfoods.fimg}');">
									<div
										class="icon d-flex justify-content-center align-items-center">
										<span class="icon-link"></span>
									</div>
								</a>
								<div class="text p-3">
									<div class="d-flex">
										<div class="one">
											<h3>
												<a href="#">${rfoods.fname}</a>
											</h3>
											<!-- <p class="rate">
												<i class="icon-star"></i> <i class="icon-star"></i> <i
													class="icon-star"></i> <i class="icon-star"></i> <i
													class="icon-star-o"></i> <span>8 Rating</span>
											</p> -->
										</div>
										<!-- <div class="two">
											<span class="price">$200</span>
										</div> -->
									</div>
									<p>${rfoods.fcontent}</p>
									<!-- <p class="days">
										<span>2 days 3 nights</span>
									</p> -->
									<hr>
									<p class="bottom-area d-flex">
										<span><i class="icon-map-o"></i> San Franciso, CA</span> <span
											class="ml-auto"><a href="#">Discover</a></span>
									</p>
								</div>
							</div>
						</div>
						</c:forEach>
						
					</div>
					<div class="row mt-5">
						<div class="col text-center">
							<div class="block-27">
								<ul>
								   <li><a href="${pageContext.request.contextPath}/userapi/getrestaurantbypage?page=1">首页</a></li>
									<li><a href="${pageContext.request.contextPath}/userapi/getrestaurantbypage?page=${pd.page-1}">&lt;</a></li>
									<c:if test="${pd.page-2>0}">
									<li><a href="${pageContext.request.contextPath}/userapi/getrestaurantbypage?page=${pd.page-2}">${pd.page-2}</a></li>
									</c:if>
									<c:if test="${pd.page-1>0}">
									<li><a href="${pageContext.request.contextPath}/userapi/getrestaurantbypage?page=${pd.page-1}">${pd.page-1}</a></li>
									</c:if>
									<li class="active"><span>${pd.page}</span></li>
									<c:if test="${pd.page+1<=pd.count}">
									<li><a href="${pageContext.request.contextPath}/userapi/getrestaurantbypage?page=${pd.page+1}">${pd.page+1}</a></li>
									</c:if>
									<c:if test="${pd.page+2<=pd.count}">
									<li><a href="${pageContext.request.contextPath}/userapi/getrestaurantbypage?page=${pd.page+2}">${pd.page+2}</a></li>
									</c:if>
									<li><a href="${pageContext.request.contextPath}/userapi/getrestaurantbypage?page=${pd.page+1}">&gt;</a></li>
									<li><a href="${pageContext.request.contextPath}/userapi/getrestaurantbypage?page=${pd.count}">末页</a></li>
								</ul>
								<span>共${pd.count}页</span>
							</div>
						</div>
					</div>
				</div>
				<!-- .col-md-8 -->
			</div>
		</div>
	</section>
	<!-- .section -->

	<section class="ftco-section-parallax">
		<div class="parallax-img d-flex align-items-center">
			<div class="container">
				<div class="row d-flex justify-content-center">
					<div
						class="col-md-7 text-center heading-section heading-section-white ftco-animate">
						<h2>订阅我们</h2>

						<div class="row d-flex justify-content-center mt-5">
							<div class="col-md-8">
								<form action="#" class="subscribe-form">
									<div class="form-group d-flex">
										<input type="text" class="form-control" placeholder="邮箱地址">
										<input type="submit" value="订阅" class="submit px-3">
									</div>
								</form>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</section>

	<jsp:include page="footer.jsp"></jsp:include>


	<script src="layui/layui.js" charset="utf-8"></script>
	<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
	<script type="text/javascript">
		//**页面加载开始****************
		$(document).ready(
				function() {
					//**加载景点主题开始**************
					$.ajax({
						url : '/happySys/hobby/findall',
						type : 'get',
						dataType : 'json',
						//data:$("#update_form").serialize(),
						success : function(data) {
							$.each(data, function(i) {
								//alert(data[i].htype+":"+data[i].hid)
								$('#hobby').append(
										'<option value="'+data[i].hid+'">'
												+ data[i].htype + '</option>');
							});
						}

					});
					//****加载景点结束*************
					//***加载省份开始*************
					$.ajax({
						url : '/happySys/province/findall',
						type : 'get',
						dataType : 'json',
						//data:$("#update_form").serialize(),
						success : function(data) {
							$.each(data, function(i) {
								//alert(data[i].htype+":"+data[i].hid)
								$('#provide').append(
										'<option value="'+data[i].provinceid+'">'
												+ data[i].provincename
												+ '</option>');
							});
						}

					});
					//***加载省份结束************
					//****加载全国所有的景点开始**********
					find()
					//****加载全国所有景点结束***********

				});
		//**页面加载结束**********
		//******根据选择的省份加载该省份的所有城市开始***
		$("#provide").blur(
				function() {

					//alert($(this).val())
					$('#city').empty();
					$('#city').append('<option value="0">选择城市</option>');
					$.ajax({
						url : '/happySys/city/findcitybyproid',
						type : 'get',
						dataType : 'json',
						data : {
							pid : $(this).val()
						},
						success : function(data) {
							$.each(data, function(i) {
								//alert(data[i].htype+":"+data[i].hid)
								$('#city').append(
										'<option value="'+data[i].cityid+'">'
												+ data[i].cityname
												+ '</option>');
							});
						}

					});

				});
		//******根据选择的省份加载该省份的所有城市结束***
		//*******点击按省份，市，主题检索景点开始*****
		$('#click_my_select').click(function() {
			find()
		});
		//*******点击按省份，市，主题检索景点结束*****
		//************查询景点*****
		function find() {
			$
					.ajax({
						url : '/happySys/scenic/findallScenic',
						type : 'get',
						dataType : 'json',
						data : {
							page : 1,
							pageSize : 10,
							pid : $("#provide").val(),
							cid : $("#city").val(),
							hid : $("#hobby").val()
						},
						success : function(msg) {
							$('#scenic_row_my').empty();
							$
									.each(
											msg.data,
											function(i) {
												var sname = msg.data[i].sname;
												var saddress = msg.data[i].saddress;
												var ssatisfaction = msg.data[i].ssatisfaction;
												var sprovince = msg.data[i].sprovince;
												var scity = msg.data[i].scity;
												var sticket = "￥"
														+ msg.data[i].sticket
														+ "起";
												var sid = msg.data[i].sid;
												var sbt = msg.data[i].sbt;
												var slong = msg.data[i].slong;//经度
												var slat = msg.data[i].slat;//纬度
												var img = msg.data[i].bigimg[3].spurl;
												//alert("sname:"+sname+";saddress:"+saddress+";sticket:"+sticket+";img:"+img);
												$('#scenic_row_my')
														.append(
																'<div class="col-sm col-md-6 col-lg-5 ">'
																		+ '<div class="destination">'
																		+ '<a href="#" class="img img-2 d-flex justify-content-center align-items-center" style="background-image: url('
																		+ img
																		+ ');width: 300px;height: 150px;">'
																		+ '<div class="icon d-flex justify-content-center align-items-center">'
																		+ '<span class="icon-link"></span>'
																		+ '</div>'
																		+ '</a>'
																		+ '<div class="text p-3">'
																		+ '<div class="d-flex">'
																		+ '<div class="one">'
																		+ '<h3><a href="#">'
																		+ sname
																		+ '</a></h3>'
																		+ '<p class="rate">'
																		+ '['
																		+ sprovince
																		+ '.'
																		+ scity
																		+ ']'
																		+ '</p>'
																		+ '</div>'
																		+ '<div class="two">'
																		+ '<span class="price">'
																		+ sticket
																		+ '</span>'
																		+ '</div>'
																		+ '</div>'
																		+ '<p>满意度：'
																		+ ssatisfaction
																		+ '</p>'
																		+ '<p class="days"><a  href="javascript:showMap('
																		+ slat
																		+ ','
																		+ slong
																		+ ');">[查看地图]</a></p>'
																		+ '<hr>'
																		+ '<p class="bottom-area d-flex">'
																		+ '<span><i class="icon-map-o"></i> San Franciso, CA</span>'
																		+ '<span class="ml-auto"><a href="'+sbt+'" target="_blank">购票</a></span>'
																		+ '</p>'
																		+ '</div>'
																		+ '</div>'
																		+ '</div>');
											});
							//**************layui开始**********	
							layui
									.use(
											[ 'laypage', 'layer' ],
											function() {
												var laypage = layui.laypage, layer = layui.layer;

												//完整功能
												laypage
														.render({
															elem : 'pageDiv2',
															count : msg.count //data.total ,
															,
															curr : msg.page //data.page
															,
															limit : msg.limit //pageSize
															,
															layout : [ 'count',
																	'prev',
																	'page',
																	'limit',
																	'next',
																	'skip' ],
															jump : function(
																	obj, first) {
																console
																		.log(obj);
																console
																		.log(first);
																//首次不执行
																if (!first) {
																	//清除ul中 li
																	$(
																			'#scenic_row_my')
																			.empty();
																	//*******************点击分页开始**************************
																	$
																			.ajax({
																				url : '/happySys/scenic/findallScenic',
																				type : 'get',
																				dataType : 'json',
																				data : {
																					page : obj.curr,
																					pageSize : obj.limit,
																					pid : $(
																							"#provide")
																							.val(),
																					cid : $(
																							"#city")
																							.val(),
																					hid : $(
																							"#hobby")
																							.val()
																				},
																				success : function(
																						msg) {

																					$
																							.each(
																									msg.data,
																									function(
																											i) {
																										var sname = msg.data[i].sname;
																										var saddress = msg.data[i].saddress;
																										var ssatisfaction = msg.data[i].ssatisfaction;
																										var sprovince = msg.data[i].sprovince;
																										var scity = msg.data[i].scity;
																										var sticket = "￥"
																												+ msg.data[i].sticket
																												+ "起";
																										var sid = msg.data[i].sid;
																										var sbt = msg.data[i].sbt;
																										var slong = msg.data[i].slong;//经度
																										var slat = msg.data[i].slat;//纬度
																										var img = msg.data[i].bigimg[3].spurl;
																										//alert("sname:"+sname+";saddress:"+saddress+";sticket:"+sticket+";img:"+img);
																										$(
																												'#scenic_row_my')
																												.append(
																														'<div class="col-sm col-md-6 col-lg-5 ">'
																																+ '<div class="destination">'
																																+ '<a href="#" class="img img-2 d-flex justify-content-center align-items-center" style="background-image: url('
																																+ img
																																+ ');width: 300px;height: 150px;">'
																																+ '<div class="icon d-flex justify-content-center align-items-center">'
																																+ '<span class="icon-link"></span>'
																																+ '</div>'
																																+ '</a>'
																																+ '<div class="text p-3">'
																																+ '<div class="d-flex">'
																																+ '<div class="one">'
																																+ '<h3><a href="#">'
																																+ sname
																																+ '</a></h3>'
																																+ '<p class="rate">'
																																+ '['
																																+ sprovince
																																+ '.'
																																+ scity
																																+ ']'
																																+ '</p>'
																																+ '</div>'
																																+ '<div class="two">'
																																+ '<span class="price">'
																																+ sticket
																																+ '</span>'
																																+ '</div>'
																																+ '</div>'
																																+ '<p>满意度：'
																																+ ssatisfaction
																																+ '</p>'
																																+ '<p class="days"><a  href="javascript:showMap('
																																+ slat
																																+ ','
																																+ slong
																																+ ');">[查看地图]</a></p>'
																																+ '<hr>'
																																+ '<p class="bottom-area d-flex">'
																																+ '<span><i class="icon-map-o"></i> San Franciso, CA</span>'
																																+ '<span class="ml-auto"><a href="'+sbt+'" target="_blank">购票</a></span>'
																																+ '</p>'
																																+ '</div>'
																																+ '</div>'
																																+ '</div>');
																									});

																				}
																			});

																	//********************点击分页结束*************************
																	//  location.href="../allmv?op=findAll&page="+obj.curr+"&pageSize="+obj.limit;
																}
															}
														});

											});
							//***************layui结束***********
						}
					});

		}
		//*********景点查询结束****
	</script>
</body>
</html>